<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
	<head>
		<title>付款结算页面</title>
        <jsp:include page="../inc_min.jsp"></jsp:include>
		<link rel="stylesheet" href="${ctx}/css/page.css"/>
		<link rel="stylesheet" href="${ctx}/css/iconfont.css"/>
		<script type="text/javascript">
		//结算单号, 按照结算单号查询支付单详情
		function payNumber(cashNo){
			//console.log(cashNo);
			layer.open({
				type: 2,
				title: ['结算单号','background-color:#28aaf0; color:#fff;'],
				shadeClose: true,
				shade: 0.3,
				yes: function(index, layero) {
					layer.close(index);
				},
				btn2: function(index, layero) {
					//取消的回调
				},
				area: ['1200px', '1200px'],  
				content: ['${ctx}/statement/detail/'+cashNo], //iframe的url，no代表不显示滚动条
				success: function(layero, index){
					  layer.full(index);
				},
				end:function(){
					//localtion.reload();
				}
			});
		};
		
		$(function(){		
			//状态背景文字切换
			$(".listArg").click(function(){
				$(".listArg").css({
					"background": "#f1f1f1",
					"color": "black"
				});
				$(this).css({
					"background": "#28aaf0",
					"color": "#FFFFFF"
				});
			});
			 $("#query").click(function (){
                 pageNum = 1;
                 getData(status);
			    });
            getData(0);
		});
        var pageNum = 1;
        function getData(status) {
            var cashNo="";//提现单号
            var orgName="";//供应商
            var startDate="";//申请日期
            var endDate="";//结束日期
            cashNo=$("#cashNo").val();
            orgName=$("#orgName").val();
            startDate=$("#startDate").val();
            endDate=$("#endDate").val();
            var param = {
                "orderNum":cashNo,
                "supplier":orgName,
                "toStartDate":startDate,
                "toEndDate":endDate,
                "status":status,
                "page":pageNum,
                "rows":20
            }
            $.get('${ctx}/statement/settlement?temp='+Math.random(),param,function(data){
                $('table tbody').empty();
                var str = "";
                for(var i=0;i<data.rows.length;i++){
                    var obj = data.rows[i];
                    var statusStr = "";
                    var buttonStr = "";
                    if(obj.status ==3){
                    	statusStr = "审核不通过"; 
                    }
                    if(obj.status ==4){ 
                    	statusStr = "提现待审核"; 
                    	//buttonStr+=	'<svg class="icon position" onclick=checkPay("'+obj.cashNo+'","'+obj.orgName+'","'+obj.applyTime+'","'+obj.cashMoney+'") aria-hidden="true"><use xlink:href="#icon-lwsh"></use></svg>';//審核
                    	buttonStr='<i class="icon iconfont position" title="审核" onclick=checkPay("'+obj.cashNo+'","'+obj.orgName+'","'+obj.applyTime+'","'+obj.cashMoney+'")>&#xe604;</i>';
                    }
                    if(obj.status ==5){ 
                    	statusStr = "提现待支付"; 
                    	buttonStr+='<span class="add_minus" style="margin-right:25px;width:60px;height:25px;" onclick=doPay("'+obj.cashNo+'"); >付款</span>';
                    }
                    if(obj.status ==6){ 
                    	statusStr = "已付款"; 
                    	//buttonStr+=	'<svg class="icon position" onclick=viewPay("'+obj.cashNo+'") aria-hidden="true"><use xlink:href="#icon-xiangqing"></use></svg>';//詳情
                    	buttonStr='<i class="icon iconfont position" title="详情" onclick=viewPay("'+obj.cashNo+'")>&#xe62d;</i>';
                    }
                    str+="<tr height='38' class='reBorder'>"
                    str+="	<td width='219' align='center'>提现单号："+obj.cashNo+"</td>"
                    str+="    <td width='1081' colspan='6' align='right' style='color:#fdc473;cursor:pointer;'>"+buttonStr+"</td>"
                    str+="</tr>"
                    str+="<tr height='90'>"
                    str+="	<td width='219' align='center'>"
                    str+="		<span style='color:#34c0e3;'>"+obj.username+"</span><br/>"
                    str+="		<span style='color:black;'>"+CommonConverter.toNullString(obj.mobile)+"</span><br/>"
                    str+="		<span style='color:black;'>"+obj.orgName+"</span>"
                    str+="	</td>"
                    str+="	<td width='173' align='center' style='color:black'>"
                    str+=   obj.applyTime
                    str+="	</td>"
                    str+="	<td width='233' align='center' style='color:#e47470'>"
                    str+=   obj.cashMoney
                    str+="	</td>"
                    str+="	<td width='183' align='center' style='color:black'>"
                    str+=   obj.accountBank
                    str+="	</td>"
                    str+="	<td width='100' align='center' style='color:black'>"+obj.accountName+"</td>"
                    str+="	<td width='238' align='center' style='color:black'>"+CommonConverter.toNullString(obj.cardID)+"</td>"
                    str+="	<td width='153' align='center' style='color:#ce342c'>"+statusStr+"</td>"
                    str+="</tr> "
                }
                $('#tb').append(str);
                //显示分页
                layui.use(['laypage', 'layer'], function(){
                    var laypage = layui.laypage;
                    laypage({
                        cont: 'pager'
                        ,pages:  Math.ceil(data.total/20) //得到总页数 //总页数
                        ,groups: 5 //连续显示分页数
                        ,skin: '#1E9FFF'
                        ,curr : pageNum
                        ,jump: function(obj,first){
                            if(!first){
                                pageNum = obj.curr;
                                getData(status);
                            }
                        }
                    });
                });
            })
        }
		//提现审核弹框
		function checkPay(cashNo,orgName,applyTime,cashMoney){
			layer.open({
				type: 2,
				title: ['提现审核信息','font-family:微软雅黑;font-size:16px;'],
				shadeClose: true,
				shade: 0.3,
				closeBtn: 1,
                fix:false,
				area: ['540px', '400px'],
				content: ['${ctx}/statement/toAudit/'+cashNo+'?orgName='+orgName+'&applyTime='+applyTime+'&cashMoney='+cashMoney, 'no'], //iframe的url，no代表不显示滚动条
				end:function(){
					getData(0);
				}
			});
		};
		//查看详情
		function viewPay(cashNo){
			layer.open({
				type: 2,
				title: ['提现单详情-提现单号：'+cashNo,'background-color:#00B2EE; color:#fff;'],
				shadeClose: true,
				shade: 0.3,
				area: ['658px', '500px'],  
				content: ['${ctx}/statement/paymentDetail/'+cashNo], //iframe的url，no代表不显示滚动条
			});
		};
		//付款
		function doPay(cashNo){
			layer.open({
				type: 2,
				title: ['付款','background-color:#00B2EE; color:#fff;'],
				shadeClose: true,
				shade: 0.3,
				yes: function(index, layero) {
					layer.close(index);
				},
				btn2: function(index, layero) {
					//取消的回调
				},
				area: ['1200px', '1200px'],  
				content: ['${ctx}/statement/paymentdetail/'+cashNo], //iframe的url，no代表不显示滚动条
				success: function(layero, index){
					  layer.full(index);
				},
				end:function(){
					getData(0);
				}
			});
		};
			
		
		</script>
	</head>
	<body >
    <jsp:include page="../head.jsp"/>
        <div class="content">
	        <ul class="list">
	            <li>提现单号：<input type="text" class="textbox" id="cashNo"/></li>
	            <li>供应商：<input type="text" class="textbox"  id="orgName" />
	            </li>
	            <li>
	              	  申请日期：
	                <input type="text" style="height:18px;" id="startDate" class="textbox" onclick="new WdatePicker({dateFmt:'yyyy-MM-dd'})"/> -
	                <input type="text" style="height:18px;" id="endDate" class="textbox" onclick="new WdatePicker({dateFmt:'yyyy-MM-dd'})"/>
	            </li>
	           <!--  <li>
	             	   财务状态：
	                <select class="easyui-combobox" data-options="panelHeight:'auto'" id="status">
	                    <option value="0">全部</option>
	                    <option value="4">提现待审核</option>
	                    <option value="5">提现待支付</option>
	                    <option value="6">已付款</option>
	                </select>
	            </li> -->
	            <li class="right">
	            	<input type="button" value="查询" class="query" style="width:90px;height:26px;" id="query"/>
	            </li>
	        </ul>
	        <ul class="list conditionList">
					<li>状态：</li>
					<li class="listArg allStatus">
						<span id="0" onclick="getData(0)">全部</span>
					</li>
					<li class="listArg">
						<span id="4" onclick="getData(4)" >待审核</span>
					</li>
					<li class="listArg">
						<span id="5" onclick="getData(5)" >待支付</span>
					</li>
					<li class="listArg">
						<span id="6" onclick="getData(6)" >已支付</span>
					</li>
				</ul>
				<table class="conTable" >
					<thead>
						<tr height="38" >
							<td width="219" align="center">供应商</td>
							<td width="173" align="center">申请时间</td>
							<td width="233" align="center">提现金额</td>
							<td width="183" align="center">开户行</td>
							<td width="100" align="center">户名</td>
							<td width="238" align="center">卡号</td>
							<td width="153" align="center">财务状态</td>
						</tr>
					</thead>
					<tbody id="tb">

					</tbody> 
			</table>
            <!-- 分页 -->
            <div id="pager" class="divBox"></div>
        </div>
   <jsp:include page="../footer.jsp"/>
</body>
</html>